<template>
  <div>
    <el-table :data="tableData" border stripe>
      <el-table-column prop="col" label="选择"></el-table-column>
      <el-table-column prop="col" label="费用类型"></el-table-column>
      <el-table-column prop="col" label="费用项目"></el-table-column>
      <el-table-column prop="col" label="费用标识"></el-table-column>
      <el-table-column prop="col" label="出账类型"></el-table-column>
      <el-table-column prop="col" label="费用ID"></el-table-column>
      <el-table-column prop="col" label="收费起始时间"></el-table-column>
      <el-table-column prop="col" label="计费结束时间"></el-table-column>
      <el-table-column prop="col" label="欠费金额"></el-table-column>
    </el-table>
    <div class="bottom-btns">
      <span style="margin-right:20px;">缴费金额：0元</span>
      <el-button type="primary" size="small" @click="goBack">返回</el-button>
      <el-button type="primary" size="small" @click="payArrearsFee">缴费</el-button>
    </div>
  </div>
</template>

<script>
  export default {
    name:'arrearsFee',
    data() {
      return {
        tableData: []
      }
    },
    methods: {
      goBack() {
        this.$emit('closeArrearsFee')
      },
      payArrearsFee() {
        this.$emit('closeArrearsFee')
      }
    },
  }
</script>

<style lang="scss" scoped>
.bottom-btns{
  margin-top: 20px;
  text-align: right;
}
</style>